<div class="module-notice-detail">
    <div class="tab-list">
        <div class="tab-block" :class="{active:active}" @click="getNotice('notice')">公告中心</div>
        <div class="tab-block" :class="{active:!active}" @click="getNotice('news')">新闻资讯</div>
    </div>
    <div class="detail-left">    
        <h3>
            <i class="list-bg"></i>
            <span v-if="active">{{$t('newList')}}</span>
            <span v-else>新闻资讯</span>
        </h3>
        <div class="search-item"><input class="search-input" v-model="title" :placeholder="$t('search')"></div>
        <ul>
            <li v-if="title === '' || item.title.indexOf(title.toUpperCase())>=0" v-for="(item,index) in list" :class="{'active' : item.id == noticeId }" @click="avtiveNotice(item)">
                <a href="javascript:;">            
                    <em>{{item.title}}</em>
                    <span class="right"></span>
                </a>
            </li>
        </ul>
    </div>
    <div class="detail-right">
        <!-- <h3 class="title">{{$t('newList')}}</h3> -->
        <loading v-if="isLoading === true"></loading>
        <div class="detail-box" v-else>
            <template v-if="detail === null">
                <no-data></no-data>
            </template>
            <template v-else>
                <div class="header">
                    <div class="title">
                        <!-- <div class="notice-tip">{{$t('detail.title')}}</div> -->
                        <div class="title-info">{{detail.title}}</div>
                    </div>
                    <div class="time">{{detail.createTime | timezone}}</div>
                </div>
                <div class="content" v-html="detail.contentHtml"></div>
            </template>
        </div>
    </div>

</div>